<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<html>
<head>
	<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
	<c:set var="ctx" value="${pageContext.request.contextPath}"/>
	<link rel="stylesheet" type="text/css" href="${ctx}/jquery-easyui-1.4.5/themes/material/easyui.css">
	<link rel="stylesheet" type="text/css" href="${ctx}/jquery-easyui-1.4.5/themes/icon.css">
	<link rel="stylesheet" type="text/css" href="${ctx}/ext/css/ext-all.css">
	<link rel="stylesheet" type="text/css" href="${ctx}/css/style.css">
	
	<script type="text/javascript" src="${ctx}/ext/js/ext-all.js"></script>
	<script type="text/javascript" src="${ctx}/jquery-easyui-1.4.5/jquery.min.js"></script>
	<script type="text/javascript" src="${ctx}/jquery-easyui-1.4.5/jquery.easyui.min.js"></script>
	<script type="text/javascript" src="${ctx}/jquery-easyui-1.4.5/locale/easyui-lang-zh_CN.js"></script>

	<script type="text/javascript" src="${ctx}/js/commom.js"></script>
	<script type="text/javascript" src="${ctx}/js/blx.js"></script>
	<script type="text/javascript" src="${ctx}/js/login.js"></script>

	<link rel="stylesheet" type="text/css" href="/css/style.css">
<title>校园微生活管理平台登录界面</title>
</head>
<script>

	var code ; //在全局定义验证码   
	//产生验证码  
	function createCode(){  
	     code = "";   
	     var codeLength = 4;//验证码的长度  
	     var checkCode = document.getElementById("imgCode");   
	     var random = new Array(0,1,2,3,4,5,6,7,8,9,'A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R',  
	     'S','T','U','V','W','X','Y','Z');//随机数  
	     for(var i = 0; i < codeLength; i++) {//循环操作  
	        var index = Math.floor(Math.random()*36);//取得随机数的索引（0~35）  
	        code += random[index];//根据索引取得随机数加到code上  
	    }  
	    checkCode.value = code;//把code值赋给验证码  
	} 
	
	function submitLoginForm() {
		var inputCode = document.getElementById("code").value;
		var imgCode = document.getElementById("imgCode").value;
		if(inputCode.value != imgCode.value){
			$.messager.alert("提示", "请输入验证码！");
		}else{
			$('#loginForm').form('submit', {
				url : '${ctx}/manage/doLogin',
				dataType : 'json',
				success : function(result) {
					var json = $.parseJSON(result);
					if (json.success == 0) {
						window.location.href = "${ctx}/manage/main";
					} else if (json.success == 1) {
						alert("用户名密码有错，请重新输入！");
						window.location.href = "${ctx}/manage";
					} else {
						$.messager.alert("提示", json.msg);
						createCode();//刷新验证码  
						$('#input').val('');
					}
				}
			});
		}
	}
	 
	
	function clearForm() {
		$('#login').form('clear');
		$('#register').form('clear');
	}
	function goRegister() {
		window.location.href = "${ctx}/manage/goRegister";
		/* $('#login').window('close'); // close a window
		$('#register').window('open'); */
	}
	function changeImg(){
		alert("随便填一个就行啦～");
	}
	function checkUsername(){
		var inputCode = document.getElementById("userName").value;
		if(inputCode.length > 15){
			$.messager.alert("提示", "最多输入15个字符");
		}
	}
	
</script>
<body onload="createCode()"><!-- bgcolor="#E6E6FA"  在css文件上处理-->
	<div id="loginDiv" align="center" class="easyui-window" title="校园微生活管理平台登录" resizable="false" closable="false" minimizable="false" maximizable="false" collapsible="false" data-options="iconCls:'icon-save'" style="width:430px;height:235px;padding:3px;">
	<table border="0">
	<tr>
	<td>
	<div style="padding:10px 10px 10px 10px" align="center">
		<img src="${ctx}/images/icon_school.png" width="110" height="110" style="background-repeat: no-repeat">
		<br>
		<a href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-add'" style="width: 90px;height: 25px"  onclick="goRegister()">注册新用户</a>
	</div>
	</td>
	<td>
		<br>
		<div style="padding:0px 10px 0px 10px" align="right">
	    <form id="loginForm" method="post" >
	    	<table cellpadding="3" border="0">
	    		<tr height="30">
	    			<td>账&nbsp;&nbsp;&nbsp;号:</td>
	    			<td><input class="easyui-validatebox textbox" onchange="checkUsername()" type="text" id="userName" name="userName" data-options="required:true" maxlength="8" style="width: 160px;height: 25px"></input></td>
	    		</tr>
	    		<tr height="30">
	    			<td>密&nbsp;&nbsp;&nbsp;码:&nbsp;&nbsp;&nbsp;</td>
	    			<td><input class="easyui-validatebox textbox"  type="password" value="" name="userPwd" data-options="required:true" maxlength="16" style="width: 160px;height: 25px"></input></td>
	    		</tr>
	    		<tr height="30">
	    			<td>验证码:&nbsp;&nbsp;&nbsp;</td>
	    			<td><input type="button" style="width: 70px; height: 25px" id="imgCode" onclick="createCode()" />
						<input class="easyui-validatebox textbox" type="text" id="code" name="code" maxlength="4" data-options="required:true" style="width:80px;height: 25px;margin-left:2px;vertical-align:middle"></input></td>
	    		</tr>
	    		<tr>
	    			<td colspan="2">
	    				<label><input name="dep" type="radio" value="1" />用户 </label> 
	    				&nbsp;&nbsp;
						<label><input name="dep" type="radio" value="2" />管理员 </label> 
						&nbsp;&nbsp;
						<label><input name="dep" type="radio" value="3" />超级管理员 </label>
	    			</td>
	    		</tr>
	    	</table>
	    </form>
	    <br>
	    <div style="text-align:center;padding:2px">
	    	<a href="javascript:void(0)" class="easyui-linkbutton" style="width: 90px;height: 25px"  onclick="submitLoginForm()">&nbsp;登&nbsp;录&nbsp;</a>
	    	<a href="javascript:void(0)" class="easyui-linkbutton" style="width: 90px;height: 25px"  onclick="clearForm()">&nbsp;取&nbsp;消&nbsp;</a>
	    	
	    </div>
	    </div>
	</td>
	</tr>
	</table>	
	</div>
	
	
	
	
</body>
</html>